	  /* 全局样式重置 */
	  * {
	  	margin: 0;
	  	padding: 0;
	  	box-sizing: border-box;
	  }

	  body {
	  	background-color: #666;
	  	/* 整体背景设为灰色，模拟原图 */
	  	font-family: sans-serif;
	  	color: #fff;

	  }

	  .all {
	  	position: relative
	  }

	  /* 顶部栏样式 */
	  .top-bar {
	  	display: flex;
	  	align-items: center;
	  	justify-content: space-between;
	  	background-color: #333;
	  	padding: 10px 20px;
	  	height: 65px;

	  }



	  /* ------------------------------------------------------------------------ */

	  /* 中间签到区域样式 */
	  .sign-area {
	  	display: flex;
	  	justify-content: center;
	  	align-items: center;
	  	height: 300px;
	  	width: 100%;
	  	background-color: #666;
	  	position: relative;
	  	top: 120px;
	  }

	  .sign-btn {
	  	display: flex;
	  	flex-direction: column;
	  	align-items: center;
	  	justify-content: center;
	  	width: 180px;
	  	height: 180px;
	  	font-family: "STHUPO";
	  	border: 10px solid #a5a3a3;
	  	background-color: #8d8d8d;
	  	border-radius: 30px;
	  	cursor: pointer;
	  }

	  .sign-text {
	  	font-size: 44px;
	  	font-family: "黑体";
	  	font-weight: bold;
	  	margin: 10px;
	  }

	  .sign-eng {
	  	font-size: 14px;
	  	margin-top: 5px;
	  }

	  /* 弹窗域样式 */
	  .popup-backdrop {
	  	width: 100%;
	  	height: 300px;
	  	background-color: #666;
	  	border-radius: 30px;
	  	position: absolute;
	  	top: 250px;
	  }

	  .popup-backdrop button {
	  	width: 100%;
	  	height: 1000px;
	  	border: none;
	  	outline: none;
	  	cursor: pointer;
	  	position: absolute;
	  	background-color: transparent;
	  	top: -200px;
	  }

	  .popup-container {
	  	width: 200px;
	  	height: 200px;
	  	border-radius: 50%;
	  	background-color: rgba(0, 0, 0, 0.5);
	  	margin: 0 auto;
	  	padding-top: 50px;
	  	text-align: center;
	  	color: #f3f1f1;
	  	font-size: 40px;
	  	font-family: "宋体";
	  	border: 10px solid rgba(255, 255, 255, 0.5);
	  }



	  /*中间显示区域 */
	  .show-area {
	  	height: 200px;
	  	width: 100%;
	  	/* background-color: #b9b9b9; */
	  	margin-top: 200px;

	  }

	  .popup-container {
	  	margin-top: -100px;

	  }

	  .popup-fade-enter-active,
	  .popup-fade-leave-active {
	  	transition: opacity 0.5s ease;
	  }

	  .popup-fade-enter-from,
	  .popup-fade-leave-to {
	  	opacity: 0;
	  }

	  /* 轮播样式（上下两行） */
	  .slider-container {
	  	position: relative;
	  	height: 150px;
	  	/* 高度翻倍，容纳两行内容 */
	  	overflow: hidden;
	  	margin-top: 20px;
	  	/* 与上方文字保持距离 */
	  }

	  .slogan-item {
	  	position: absolute;
	  	width: 100%;
	  	transition: opacity 0.5s ease;
	  	opacity: 0;
	  	/* 默认隐藏 */
	  	text-align: center;
	  	/* 文字居中 */

	  }

	  .slogan-item.active {
	  	opacity: 1;
	  	/* 激活项显示 */
	  }

	  /* 行样式：控制行间距和字体 */
	  .slogan-line {
	  	height: 50px;
	  	/* 每行高度 */
	  	line-height: 80px;
	  	/* 垂直居中 */
	  	font-size: 52px;
	  	/* 字体大小 */
	  	font-family: "楷体";
	  }

	  /* 中间区域渐入渐出动画 */
	  .fade-enter-active,
	  .fade-leave-active {
	  	transition: opacity 0.5s ease, transform 0.5s ease;
	  }

	  .fade-enter-from,
	  .fade-leave-to {
	  	opacity: 0;
	  	transform: translateY(20px);
	  	/* 添加轻微上移效果 */
	  }

	  /* 弹窗容器动画 */
	  .popup-container {
	  	transition: transform 0.5s ease;
	  }

	  .popup-fade-enter-from .popup-container {
	  	transform: scale(0.9);
	  }

	  .popup-fade-leave-to .popup-container {
	  	transform: scale(1.1);
	  }

	  /* ------------------------------------------------------------------------ */


	  /* 底部学习区域样式 */
	  .learn-area {
	  	display: flex;
	  	justify-content: center;
	  	gap: 20px;
	  	padding: 20px;
	  	position: fixed;
	  	bottom: 100px;
	  	left: 250px;
	  }

	  .learn-box,
	  .review-box {
	  	width: 250px;
	  	height: 100px;
	  	background-color: #bdbcbc;
	  	color: #000;
	  	padding: 15px 20px;
	  	margin: 0 30PX 0 30PX;
	  	border-radius: 30px;
	  	text-align: center;
	  	text-decoration: none;
	  }

	  .learn-title,
	  .review-title {
	  	font-size: 32px;
	  	font-family: "Impact";
	  	margin: 10px;
	  }

	  .learn-desc,
	  .review-desc {
	  	margin-top: 5px;
	  	font-size: 16px;
	  	font-family: "黑体";
	  	font-weight: bolder;

	  }


	  .learn-count,
	  .review-count {
	  	color: rgb(247, 160, 0);
	  	font-size: 18px;
	  }


	  .vocab-box {
	  	width: 160px;
	  	background-color: #b9b9b9;
	  	border: none;
	  	border-radius: 48px;
	  	color: #ffffff;
	  	font-size: 16px;
	  	font-weight: 600;
	  	text-align: center;
	  	padding: 10px 20px;
	  	align-items: center;
	  	justify-content: center;
	  	text-decoration: none;
	  }

	  .vocab-box img {
	  	width: 50px;
	  	margin-bottom: 3px;

	  }